<template>
  <div>
    <h1>数据统计</h1>
    <div id="main" style="width: 300px ;height: 400px"></div>
    <div id="dain" style="width: 300px ;height: 400px"></div>
    <div id="cain" style="width: 300px ;height: 400px"></div>
    <div id="bain" style="width: 300px ;height: 400px"></div>
  </div>
</template>

<script>
import * as echarts from 'echarts';

export default {
  name: "CountView",
  data(){
    return{
        x:[],
        y:[]
    }
  },
  methods:{
    getCountListD(){
      this.axios.post("sysDept/countListd").then(resp=>{
        console.log(resp)


        for (let i = 0; i < resp.data.data.length; i++) {
          this.x[i] = resp.data.data[i].leader
          this.y[i] = resp.data.data[i].leader

        }

        var chartDom = document.getElementById("bain")
        var myChart = echarts.init(chartDom)
        var option;

        option = {
          xAxis: {
            type: 'category',
            data: this.x
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
              data: this.y,
              type: 'bar'
            }
          ]
        };
        option &&myChart.setOption(option)


      })
    },
    getCountListC(){
        this.axios.post("sysDept/countListC").then(resp=>{
          console.log(resp)
          for (let i = 0; i < resp.data.data.length; i++) {
            this.x[i] = resp.data.data[i].parentId
            this.x[i] = resp.data.data[i].count
          }

          var chartDom = document.getElementById("cain")
          var myChart = echarts.init(chartDom)
          var option;

          option = {
            xAxis: {
              type: 'category',
              data: this.x
            },
            yAxis: {
              type: 'value'
            },
            series: [
              {
                data: this.y,
                type: 'bar'
              }
            ]
          };

          option &&myChart.setOption(option)


        })
    },
    getCountListb(){
        this.axios.post("sysDept/countListb").then(resp=>{
          console.log(resp)

          for (let i = 0; i < resp.data.data.length; i++) {
            this.x[i] = resp.data.data[i].createBy
            this.y[i] = resp.data.data[i].conunt

          }

          var chartDom = document.getElementById('dain');
          var myChart = echarts.init(chartDom)
          var option;

          option = {
            xAxis: {
              type: 'category',
              data: this.x
            },
            yAxis: {
              type: 'value'
            },
            series: [
              {
                data: this.y,
                type: 'bar'
              }
            ]
          };

          option &&myChart.setOption(option)


        })
    },
    getCountList(){
        this.axios.post("sysDept/countList").then(resp=>{
          console.log(resp)

          for (let i = 0; i < resp.data.data.length; i++) {
              this.x[i] = resp.data.data[i].leader
              this.y[i] = resp.data.data[i].leader
          }



            var chartDom = document.getElementById('main');
            var myChart = echarts.init(chartDom);
            var option;

            option = {
              xAxis: {
                type: 'category',
                data: this.x
              },
              yAxis: {
                type: 'value'
              },
              series: [
                {
                  data: this.y,
                  type: 'bar'
                }
              ]
            };

            option && myChart.setOption(option)

        })
    }

  },
  created() {
    this.getCountList()
    this.getCountListb()
    this.getCountListC()
    this.getCountListD()
  }
}
</script>

<style scoped>

</style>
